<template>
    <div class="wrapper">
     <el-input
     :value="value"
     class="input"
     @input="(val)=>$emit('input',val)"
      placeholder="请输入内容">
            <el-button 
            @click="$emit('search')"
            :loaing="loading"  
            slot="append" 
            icon="el-icon-search">
            </el-button>
    </el-input>
    <el-button 
    @click="$emit('click')"
    type="primary"
    v-if="$slots.default">
         <slot></slot>
    </el-button>
    </div>
</template>

<script>
    export default {
        name:"Search",
        props:{
            /**
             * 搜索区的值
             */
            value:String,
            /**
             * loading
             */
            loading:Boolean,
        }
    }
</script>

<style lang="scss" scoped>
.wrapper{
    margin-bottom: 15px;
    .input{
        width: 400px;
        margin-right: 20px;
    }
}

</style>